import { View } from "@tarojs/components"
import { CSSProperties, PropsWithChildren } from "react"

interface IProps extends PropsWithChildren {
  circle?: boolean;
  type?: 'primary' | 'danger' | 'default';
  style?: CSSProperties;
  onClick?: () => void;
}
export const MyButton = (props: IProps) => {
  const { circle = false, type = 'default', onClick, children, style } = props;
  return <View onClick={onClick} style={{
    padding: 10,
    borderRadius: circle? '50%' : 4,
    backgroundColor: type === 'primary'? '#1677ff' : type === 'danger'? '#ff4d4f' : '#fff',
    border: 'solid 1px',
    borderColor: type === 'primary'? '#1677ff' : type === 'danger'? '#ff4d4f' : '#d9d9d9',
    color: type !== 'default' ? '#fff' : '#333',
    width: 40,
    height: 40,
    display: 'flex',
    alignItems: 'center',
    justifyContent: 'center',
    fontSize: 12,
    cursor: 'pointer',
    ...style
  }}>{children}</View>
}